<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>酒店列表</title>
    <link rel="stylesheet" type="text/css" href="../../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/iconfont/iconfont.css">
    <link rel="stylesheet" href="../../../css/index/hotel/common.css">
    <link rel="stylesheet" href="../../../css/index/hotel/calendar.css">
    <link rel="stylesheet" href="../../../css/index/hotel/new_list.css">
</head>
<body style="cursor:pointer;">
    <header class="aui-bar aui-bar-nav qt-bg-white" id="header">
        <a class="aui-pull-left aui-btn" onclick="closeWin();" style="height: 3rem;align-items: flex-end;">
            <span class="aui-iconfont aui-icon-left"></span>
        </a>
        <div class="search-head">
            <div class="qt-grid qt-font12 search-box qt-mb10 qt-mr8">
                <div class="qt-heavy-grey time-condition">
                    <p>住<span class="qt-ml5" id="startDate">0911</span></p>
                    <p>离<span class="qt-ml5" id="endDate">09-2</span></p>
                </div>
            </div>
            <div class="qt-ml10 search-box" style="max-width: 78%;display: flex;">
                <div class="select-city qt-font-main">太原</div>
                <div class="search-input">
                    <div class="aui-col-xs-3">
                        <i class="aui-iconfont aui-icon-search qt-font16 qt-heavy-grey"></i>
                    </div>
                    <div class="aui-list-item-input">
                        <input type="text" placeholder="地名/关键词" id="city-search">
                    </div>
                </div>
            </div>
            <!--<div class="location-container qt-ml0 qt-mt20">
                <i class="iconfont icon-dingwei1 h3 qt-heavy-grey qt-bold"></i>
            </div>-->
        </div>
    </header>
    <div class="qt-wrapper">
         <div class="qt-content">
             <div class="qt-sub-header">
                 <ul class="qt-grid qt-center qt-bt-x1 qt-bb-x1 condition-select">
                     <li id="sort-btn" class="qt-bl-x1 sort-btn select" data-for="recommend-sort">
                         <span>推荐排序</span><i class="iconfont icon-xiala qt-middle"></i>
                     </li>
                     <li id="star-btn" class="qt-bl-x1 star-btn">
                         <span>星级价格</span><i class="iconfont icon-xiala arrow-down qt-middle"></i>
                     </li>
                     <li id="location-btn" class="qt-bl-x1 location-btn" data-for="location-area-filter">
                         <span>位置区域</span><i class="iconfont icon-xiala qt-middle"></i>
                     </li>
                 </ul>
             </div>
             <div class="list-inner" style="overflow-y: scroll;">
                 <div class="list-content">
                     <div class="content">
                         <ul style="">
                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>
                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>
                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>
                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>
                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>
                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>
                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>
                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>

                             <li class="qt-bb-x1 qt-pa10" data-id="beijing_city_43321">
                                 <div class="list-img">
                                     <img src="https://userimg.qunarzz.com/imgs/201805/11/JhS1_tJ7WiMkgXwlJ480.jpg">
                                 </div>
                                 <div class="list-info">
                                     <a href="javascript:;">
                                         <p class="qt-black hotel-title">北京首都机场T3驿站</p>
                                     </a>
                                     <p class="base-info clearfix ">
                                        <span>
                                            <span class="qt-blue qt-font16">4.8分  非常棒</span> / 499条评论
                                        </span>
                                     </p>
                                     <p class="text location">
                                         <span class="font-overflow" style="width: 75%;">北京顺义区岗山路42号10号楼1-2层</span>
                                         <span class="right"><span class="qt-mr5 price"><span class="qt-grey qt-font12"></span><i>¥</i>208</span>起</span>
                                     </p>
                                 </div>
                             </li>

                         </ul>
                         <!--<div class="qt-center qt-blue load-more qt-mb10">
                             查看更多<i class="qt-hide icon spinner"></i>
                         </div>-->
                     </div>
                 </div>

             </div>
         </div>
         <div class="qt-mask" style="height: 1987px; opacity: 0; display: none;"></div>
     </div>

    <div class="qt-sidebar top">
        <!-- 排序 start -->
        <ul class="recommend-sort qt-hide">
            <li class="" data-path="-0" data-value="0">
                <i class="icon checkmark"></i>
                <p class="qt-bb-x1">推荐排序</p>
            </li>
            <li class="" data-path="-1" data-value="1">
                <i class="icon checkmark"></i>
                <p class="qt-bb-x1">低价优先</p>
            </li>
            <li class="" data-path="-2" data-value="2">
                <i class="icon checkmark"></i>
                <p class="qt-bb-x1">高价优先</p>
            </li>
            <li class="" data-path="-3" data-value="3">
                <i class="icon checkmark"></i>
                <p class="qt-bb-x1">星级优先</p>
            </li>
        </ul>
        <!-- 排序 end -->

        <!-- 区域筛选 start -->
        <div class="location-area-filter qt-hide">
            <div class="content" style="height: 420px;">
                <ul class="left-nav qt-br-x1">
                    <li class="qt-bb-x1 qt-br-x1 administration-nav active" data-for="administration">行政区</li>

                    <li class="qt-bb-x1 qt-br-x1 business-zone-nav" data-for="business">商业区</li>
                </ul>
                <div class="right-detail">
                    <div class="pl40 select-box checkbox-select administration">
                        <div class="all" data-for="administration" data-path="administration-nav">
                            <p class="check-out active">
                                <i class="aui-iconfont aui-icon-correct"></i>
                                <!--<input type="checkbox" class="check-inner">-->
                            </p>
                            <div class="qt-bb-x1 col10">
                                <p class="dname">不限</p>
                            </div>
                        </div>
                        <ul>
                            <li class="" data-all="all" data-value="首都机场">
                                <p class="check-out">
                                    <i class="aui-iconfont aui-icon-correct"></i>
                                    <!--<input type="checkbox" class="check-inner">-->
                                </p>
                                <div class="qt-bb-x1 col10">
                                    <p class="dname">首都机场</p>
                                    <!--<p class="sub-tips">7%用户选择</p>-->
                                </div>
                            </li>
                        </ul>
                    </div>

                    <div class="pl40 select-box checkbox-select business qt-hide">
                        <div class="all" data-for="business" data-path="business-zone-nav">
                            <p class="check-out active">
                                <i class="aui-iconfont aui-icon-correct"></i>
                                <!--<input type="checkbox" class="check-inner">-->
                            </p>
                            <div class="qt-bb-x1 col10">
                                <p class="dname">不限</p>
                            </div>
                        </div>
                        <ul>
                            <li class="" data-all="all" data-value="东城区">
                                <p class="check-out">
                                    <i class="aui-iconfont aui-icon-correct"></i>
                                    <!--<input type="checkbox" class="check-inner">-->
                                </p>
                                <div class="qt-bb-x1 col10">
                                    <p class="dname">东城区</p>
                                    <!--<p class="sub-tips"></p>-->
                                </div>
                            </li>
                            <li class="" data-all="all" data-value="西城区">
                                <p class="check-out ">
                                    <i class="aui-iconfont aui-icon-correct"></i>
                                    <!--<input type="checkbox" class="check-inner">-->
                                </p>
                                <div class="qt-bb-x1 col10">
                                    <p class="dname">西城区</p>
                                    <!--<p class="sub-tips"></p>-->
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="qt-bt-x1 operation-btn">
                <button class="empty" data-for="all">清空</button>
                <button class="submit">确定</button>
            </div>
        </div>
        <!-- 区域筛选 start -->
    </div>

    <div class="mask_calendar">
        <div class="calendar" style=""></div>
    </div>
    <div id="backTop" style="position: fixed;bottom: 10%;right:5%;display: none;"><i class="iconfont icon-huidaodingbu qt-light-grey" style="font-size: 35px;"></i></div>

    <div class="no-data qt-hide">
        <div class="tips" style="margin-top: 150px">
            <p class="qt-font12 qt-center info">无符合要求的酒店，请切换筛选条件进行搜索</p>
        </div>
    </div>
</body>

</html>
<script type="text/template" charset="utf-8" id="hotelTel">
    {{ for(let i=0;i< it.length;i++){ }}
        <li class="qt-bb-x1 qt-pa10 list-item" data-hotelId="{{= it[i].HotelId}}">
            <div class="list-img">
                <img src="{{= it[i].ThumbNailUrl}}">
            </div>
            <div class="list-info">
                <a href="javascript:;">
                    <p class="qt-black hotel-title">{{= it[i].HotelName}}</p>
                </a>
                <p class="base-info clearfix">
                    <span>
                        <span class="qt-blue qt-font14">{{= it[i].Score}}分  {{= it[i].ScoreTxt}}</span> / {{= it[i].ScoreCount}}条评论
                    </span>
                </p>
                <p class="text location">
                    <span class="font-overflow" style="width: 75%;">{{= it[i].Location}}</span>
                    <span class="right">
                        <span class="qt-mr5 price">
                            <span class="qt-grey qt-font12"></span>
                            {{ if(it[i].LowRate === 0){ }}
                                暂不可预订
                            {{ } else{ }}
                                <i>¥</i>{{= it[i].LowRate}}
                            {{ } }}

                        </span>起
                    </span>
                </p>
            </div>
        </li>
    {{ } }}
</script>
<script type="text/x-dot-template" charset="utf-8" id="administrationTpl">
    {{ if(it == '暂无'){ }}
        <li class="aui-list-item" onclick="has_seleced(this)">
            <div class="qt-grey content empty" style="height: 420px;">
                <p class="tips">暂无可选择位置区域</p>
            </div>
        </li>
    {{ }else{ }}
        {{ for(var i=0; i< it.length; i++){ }}
            <li class="" data-path="administration" data-value="{{=it[i].name}}" data-code="{{= it[i].code}}">
                <p class="check-out">
                    <i class="aui-iconfont aui-icon-correct"></i>
                </p>
                <div class="qt-bb-x1 col10">
                    <p class="dname">{{=it[i].name}}</p>
                </div>
            </li>
        {{ } }}
    {{ } }}
</script>
<script type="text/x-dot-template" charset="utf-8" id="businessTpl">
    {{ if(it=='暂无'){ }}
        <li class="aui-list-item" onclick="has_seleced(this)">
            <div class="qt-grey content empty" style="height: 420px;">
                <p class="tips">暂无可选择位置区域</p>
            </div>
        </li>
    {{ }else{ }}
        {{ for(var i=0; i< it.length; i++){ }}
            <li class="" data-path="business" data-value="{{=it[i].name}}" data-code="{{=it[i].code}}">
                <p class="check-out ">
                    <i class="aui-iconfont aui-icon-correct"></i>
                    <!--<input type="checkbox" class="check-inner">-->
                </p>
                <div class="qt-bb-x1 col10">
                    <p class="dname">{{=it[i].name}}</p>
                    <!--<p class="sub-tips"></p>-->
                </div>
            </li>
        {{ } }}
    {{ } }}
</script>
<script type="text/javascript" src="../../../script/extend/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../../../script/aui/api.js"></script>
<script type="text/javascript" src="../../../script/aui/aui-dialog.js"></script>
<script type="text/javascript" src="../../../script/extend/hotel/date.js"></script>
<script type="text/javascript" src="../../../script/common.js"></script>
<script type="text/javascript" src="../../../script/config.js"></script>
<script type="text/javascript" src="../../../script/extend/doT.min.js"></script>
<script type="text/javascript" src="../../../service/index/hotel/list.js"></script>
<script type="text/javascript">

    apiready = function() {
        api.parseTapmode();

        if (deviceType() === 'ios') {
            $('.aui-pull-left.aui-btn').css('height','2.1rem');
            $('.location-container').removeClass('qt-mt20').addClass('qt-mt10');
            $('.select-city').css('lineHeight','1.3rem');
            $('.search-input div.aui-col-xs-3').css('lineHeight','1rem');
        }
        var header = $api.byId('header');

        $api.fixStatusBar(header);

        new list();
    };
</script>
